<template>
    <h1>Hello</h1>
    <h2>姓名：{{ name }}</h2>
    <h2>性别：{{ gender }}</h2>
    <h2>年龄：{{ age }}</h2>
    <button @click="changeName">修改姓名</button>
    <button @click="changeAge">修改年龄</button>
    <button @click="showTel">显示电话</button>
</template>

<script setup lang="ts" name="Person001">
    import { ref } from 'vue'
    let name = ref('张三')
    let age = ref(20)
    let gender = '男'
    let tel = '12345678'
    function changeName() {
        name.value = '李四'
    }
    function changeAge() {
        age.value += 1;
    }
    function showTel() {
        alert(tel)
    }
        
</script>

